{% extends 'base.html' %}

{% block yemei %}
    <header class="masthead" style="background-image: url(http://rskill.plus/img-api/index.php)">
        <div class="container position-relative px-4 px-lg-5">
            <div class="row gx-4 gx-lg-5 justify-content-center">
                <div class="col-md-10 col-lg-8 col-xl-7">
                    <div class="site-heading">
                        <h1>rskil Blog</h1>
                        <span class="subheading">一个由 Flask 框架构建的个人博客系统</span>
                    </div>
                </div>
            </div>
        </div>
    </header>
{% endblock %}


{% block zhuti %}
    {# for 循环调用查询到的posts #}
    {% for post in posts %}
        {# 将文章信息打印出来 #}
        <div class="post-preview" align="center">
            <a href="{{ url_for('post', post_id=post['id']) }}">
                <h2 class="post-title">{{ post['title'] }}</h2>
<!--                这里post['content'][0:18] 是对post['content']字符串进行截取，只输出前18个字符 -->
                <h3 class="post-subtitle">{{ post['content'][0:18] }}...</h3>
            </a>
            <p class="post-meta">Created on {{ post['created'] }} </p>
        </div>
    {% endfor %}
{% endblock %}
